<template>
    <div>
        <div class="head">
            {{ file.filename }}
        </div>
        <PreviewVideo :fileId="file.id" v-if="file.fileType == 1"></PreviewVideo>
        <PreviewDoc :fileId="file.id" v-else-if="file.fileType == 5"></PreviewDoc>
        <PreviewPdf :fileId="file.id" v-else-if="file.fileType == 4"></PreviewPdf>
        <PreviewExcel :fileId="file.id" v-else-if="file.fileType == 6"></PreviewExcel>
        <PreviewImg :fileId="file.id" v-else-if="file.fileType == 3"></PreviewImg>
        <PreviewTxt :fileId="file.id" v-else-if="file.fileType == 7 || file.fileType == 8"></PreviewTxt>
        <div v-else>
            <span>无法在线预览，请下载</span>
        </div>
    </div>
</template>

<script>
import PreviewDoc from './preview-doc'
import PreviewPdf from './preview-pdf'
import PreviewExcel from './preview-excel'
import PreviewVideo from './preview-video'
import PreviewImg from './preview-img'
import PreviewTxt from './preview-txt'
export default {
    name: "preview",
    props: ["file"],
    components: {
        PreviewDoc,
        PreviewPdf,
        PreviewExcel,
        PreviewVideo,
        PreviewImg,
        PreviewTxt
    },

}
</script>

<style scoped>
    .head{
        text-align: center;
        margin-bottom: 10px;
    }
</style>